<%--
  Date: 2024/10/17 8:50
  Description:
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.9.18/dist/css/layui.css" rel="stylesheet">
    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.9.18/dist/layui.js"></script>
</head>
<body>

<style>
    .demo-login-container{width: 320px; margin: 21px auto 0;}
    .demo-login-other .layui-icon{position: relative; display: inline-block; margin: 0 2px; top: 2px; font-size: 26px;}
    #box{
        margin-top: 20px;
    }
</style>

<div id="box">
    <h3 style="color: #16baaa;text-align: center">完善个人信息</h3>
    <form class="layui-form"  lay-filter="personalForm">
        <input type="hidden" name="id">
        <div class="demo-login-container">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                    <input type="text" name="username" readonly value="" lay-verify="required" placeholder="用户名" lay-reqtext="请填写用户名" autocomplete="off" class="layui-input" lay-affix="clear">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">年龄</label>
                <div class="layui-input-block">
                    <input type="number" name="age" value="" lay-verify="required" placeholder="年  龄" lay-reqtext="请填写年龄" autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">联系方式</label>
                <div class="layui-input-block">
                    <input type="text" name="tel" value="" lay-verify="required" placeholder="联系方式" lay-reqtext="请填写联系方式" autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item" pane>
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                    <input type="radio" name="sex" value="男" title="男" checked>
                    <input type="radio" name="sex" value="女" title="女">
                </div>
            </div>
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="demo-personal">提交</button>
            </div>
        </div>
    </form>
</div>


<script>
    layui.use(function(){
        var form = layui.form;
        let $ = layui.jquery;
        var layer = layui.layer;


        //数据回显
        let user =  JSON.parse(sessionStorage.getItem("user"))
        sessionStorage.removeItem("user")
        form.val('personalForm',user)


        // 提交事件
        form.on('submit(demo-personal)', function(data){
            var field = data.field; // 获取表单字段值

            // 此处可执行 Ajax 等操作
            $.post('/javaweb/user?method=editPersonalInfo',field,function (res){
                if (res.code==0){
                    layer.msg(res.msg,{icon:1},function () {
                        // 关闭弹出层
                        var index = parent.layer.getFrameIndex(window.name); // 先得到当前 iframe 层的索引
                        parent.layer.close(index); // 再执行关闭
                    })
                }else{
                    layer.msg(res.msg,{icon:2})
                }
            })
            return false; // 阻止默认 form 跳转
        });
    });
</script>
</body>
</html>
